<script setup lang="ts">
import { RouterLink } from 'vue-router';


</script>

<template>

    <el-container>
        <el-main class="main">
            <RouterLink to="/OrganizerComponent" class="router-link">
                <el-card shadow="always">
                    <span>组织者通道</span>
                </el-card>
            </RouterLink>
            <RouterLink to="/ParticipantComponents" class="router-link">
                <el-card shadow="always">
                    <span>参与者通道</span>
                </el-card>
            </RouterLink>
        </el-main>
    </el-container>
</template>

<style scoped>
.main{
  background-color: #d48484;
  height: 94vh;
  display: flex;
  justify-content: space-evenly;
}
.el-card{
  height: 30vh;
  width: 20vw;
}
.el-card:hover{
    content: " ";
    display: inline-block;
    width: 30vw;
    height: 40vh;
    background-color: #fafafa;
    border-radius: 10px;
}
.router-link{
  text-decoration: none;
}
</style>